
        <link rel="stylesheet" type="text/css" href="view/css/page_event.css">
       <?php include 'view/haut.php'; ?>
    
        <div id="lightpage" style="display : none;">
            <div id="lightbox">
                <div id="reduce" class="toolsbar"><a href="#" id="reduce_i" onClick="lightbox_cloe_click('lightpage_reduce');" onMouseOut="lightbox_close_out('reduce');" onMouseOver="lightbox_close_over('reduce');">-</a></div>
                <div id="close" class="toolsbar"><a href="#" id="close_x" onClick="lightbox_cloe_click('lightpage');" onMouseOut="lightbox_close_out('close');" onMouseOver="lightbox_close_over('close');">x</a></div>
                <h2>Demande de participation</h2>
                <p>N'hésitez pas à nous envoyer vos candidatures pour participez en Star au bar L'Alliance</p>
                <form method="post" action="index.php?page=participation">
                    <label for="email">Email*</label>
                    <input type="text" id="email" name="email"/></input>
                    <label for="tel">Téléphone*</label>
                    <input type="text" id="tel" name="tel"></input>
                    <label for="sweb">Site web</label>
                    <input type="text" id="sweb" name="sweb"></input>
                    <label for="desc">Description*</label>
                    <textarea type="text" id="desc" name="desc"></textarea>
                    <br>
                    <input type="submit" value="envoyer"></input>
                </form>
            </div>
        </div>

        <div id="reduce_base" style="display : none;">
            <div id="reduce_show" class="toolsbar"><a href="#" id="reduce_show_i" onClick="lightbox_open_click('reduce_base', 'lightpage');" onMouseOut="lightbox_close_out('reduce_show');" onMouseOver="lightbox_close_over('reduce_show');">[]</a></div>
            <div id="reduce_close" class="toolsbar"><a href="#" id="reduce_close_i" onClick="lightbox_cloe_click('reduce_base');" onMouseOut="lightbox_close_out('reduce_close');" onMouseOver="lightbox_close_over('reduce_close');">x</a></div>
            <div id="reduce_text">Demande de participation</div>
        </div>

        </div>
         
            <div id="middle_mid">
                <?php if (!$full) {
                    ?>
                    <img src="./view/images/seproduire.png" id="participer_button" value="Formulaire de participation" onClick="lightbox_open_click('', 'lightpage')"/>
                <?php } ?>
                <?php
                while ($row = mysql_fetch_array($content['event'])) {
                    ?>
                    <div class="middle_article_tranche">

                        <div class="middle_article">
                            <?php
                            echo '<div id="ombre"> <img src="' . $row['EVENT_IMG'] . '"/></div>';
                            echo '<h2>' . $row['EVENT_TITLE'] . '</h2>';
                            if ($full) {
                                echo '<p>' . $row['EVENT_CONTENT'] . '</p>';
                            } else {
                                echo '<p>' . substr($row['EVENT_CONTENT'], 0, 100) . '...</p>';
                            }
                            echo '<p>le '.substr($row['EVENT_TIME'], 8, 2).'/'.substr($row['EVENT_TIME'], 5, 2).'/'.substr($row['EVENT_TIME'], 0, 4).' ';
                            echo 'à '.substr($row['EVENT_HOUR'], 0, 2).':'.substr($row['EVENT_HOUR'], 3, 2).'</p>';
                            echo '<form class="event_form" method="post" action="index.php?page=Evénements">';
                            echo '<input type="hidden" name="id" value="' . $row['EVENT_ID'] . '">';
                            $id = $row['EVENT_ID'];
                            if (!$full) {

                                echo '<input id="lire_suite" type="image" src="./view/images/liresuite.png" value="lire la suite"';
                            }
                            echo '</form>';
                            ?></div>
                    </div>

                    <?php
                }
                ?>
                <?php if ($full) {
                    ?>
                    <div class="middle_article">
                        <img src="./view/images/commentaires.png" id="bouton_comment" onmouseover="etat();" onmouseout="etatOff();" onClick="toggle();"/>
                        <div id="flech_coment"></div>

                    </div>
                    <div id="commentDiv" style="overflow : hidden;">
                        <div id="commentaires">
                            <?php
                            $i = 0;
                            while ($row2 = mysql_fetch_array($content['comment'])) {
                                echo '<div id="user" <h5 class="name_user">' . $row2['COMMENT_USER'] . '</h5><span class="note">' . $row2['COMMENT_NOTE'] . '/5</span></div>';

                                if ($i % 2 != 0) {
                                    echo '<div id="txt_comment_impaire" <p>' . $row2['COMMENT_CONTENT'] . '</p></div>';
                                } else {
                                    echo '<div id="txt_comment_paire" <p>' . $row2['COMMENT_CONTENT'] . '</p></div>';
                                } 
                                $i++;
                            }
                            ?>
                        </div>
                        <form onSubmit="return validFormComment(this);" id="commentForm" method="post" action="index.php?page=Evénements">
                            <input type="hidden" name="addComment" value="comment"></input>
                            <label for="pseudo">Pseudo</label>
                            <div id="divPseudo"><input type="text" id="pseudo" name="pseudo"></input></div>

                            <label for="comment">Message</label>
                            <div id="divCommentError"><textarea id="comment" name="comment"></textarea></div>
                            <br>
                            <label for="note">note</label>
                            <div id="divNote">
                                <input id="note" type="radio" name="note" value="1">1</input>
                                <input id="note" type="radio" name="note" value="2">2</input>
                                <input id="note" type="radio" name="note" value="3">3</input>
                                <input id="note" type="radio" name="note" value="4">4</input>
                                <input id="note" type="radio" name="note" value="5">5</input>
                            </div>
                            <br>
                            <input type="image" src="./view/images/envoyer.png" value="commenter" id="envoyer"/>
                            <?php echo '<input type="hidden" name="id" value="' . $id . '">'; ?>
                        </form>
                    </div>
                <?php } ?>

            </div>
            <div id="middle_down"></div>
            <div id="barre_down"></div>
        </div>
        <script src="view/js/script.js"></script>
        <?php if($full){ ?>
        <script src="view/js/slideAnimation.js"></script>
        <?php } ?>
        <script type="text/javascript">           
            function lightbox_close_over(id){
                document.getElementById(id).style.backgroundColor = "grey";
            }
            function lightbox_close_out(id){
                document.getElementById(id).style.backgroundColor = "black";
            }
            function lightbox_cloe_click(action){
                if(action=="lightpage_reduce"){
                    document.getElementById("reduce_base").style.display = "block";
                    action = action.replace("_reduce", "");
                }
                document.getElementById(action).style.display = "none";
            }
            function lightbox_open_click(idHide, idShow){
                if(idHide!=""){
                    document.getElementById(idHide).style.display = "none";
                }
                document.getElementById(idShow).style.display = "block";
            }

            function etat(){
                document.getElementById("flech_coment").removeAttribute("style");
                if(commentDiv.style.height == "0px"){
                    document.getElementById("flech_coment").setAttribute("style", "background-image:url(./view/images/affich_coment.png);");
                }else{
                    document.getElementById("flech_coment").setAttribute("style", "background-image:url(./view/images/masque_coment.png);");
                }
            }

            function etatOff(){
                document.getElementById("flech_coment").removeAttribute("style");
            }
        </script>
    </body>
</html>